<!DOCTYPE html>


<html lang="zh-CN" >


<head>
  <meta charset="utf-8" />
   
  <meta name="keywords" content="生活,旅行,思考,代码,博客" />
   
  <meta name="description" content="有空常回来看看" />
  
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
  <title>
     心
  </title>
  <meta name="generator" content="hexo-theme-yilia-plus">
  
  <link rel="shortcut icon" href="/favicon.ico" />
  
  
<link rel="stylesheet" href="/dist/main.css">

  
<link rel="stylesheet" href="/css/custom.css">

  
  <script src="https://cdn.jsdelivr.net/npm/pace-js@1.0.2/pace.min.js"></script>
  
  

  

<link rel="alternate" href="/atom.xml" title="心" type="application/atom+xml">
</head>

</html>

<body>
  <div id="app">
    <main class="content on">
      
<section class="cover">
    
  <div class="cover-frame">
    <div class="bg-box">
      <img src="/images/cover111.jpg" alt="image frame" />
    </div>
    <div class="cover-inner text-center text-white">
      <h1><a href="/">心</a></h1>
      <div id="subtitle-box">
        
        <span id="subtitle"></span>
        
      </div>
      <div>
        
      </div>
    </div>
  </div>
  <div class="cover-learn-more">
    <a href="javascript:void(0)" class="anchor"><i class="ri-arrow-down-line"></i></a>
  </div>
</section>



<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.11/lib/typed.min.js"></script>

<div id="main">
  <section class="outer">
  <article class="articles">
    
    
    
    
    <article id="post-CSS基础问题" class="article article-type-post" itemscope
  itemprop="blogPost" data-scroll-reveal>

  <div class="article-inner">
    
    <header class="article-header">
       
<h2 itemprop="name">
  <a class="article-title" href="/2020/04/09/CSS%E5%9F%BA%E7%A1%80%E9%97%AE%E9%A2%98/"
    >CSS基础问题</a> 
</h2>
 

    </header>
    

    
    <div class="article-meta">
      <a href="/2020/04/09/CSS%E5%9F%BA%E7%A1%80%E9%97%AE%E9%A2%98/" class="article-date">
  <time datetime="2020-04-09T08:31:45.020Z" itemprop="datePublished">2020-04-09</time>
</a>
      
      
      
      
    </div>
    

    

    
    <div class="article-entry" itemprop="articleBody">
      
      

      
      <h2 id="CSS部分基础问题整理"><a href="#CSS部分基础问题整理" class="headerlink" title="CSS部分基础问题整理"></a>CSS部分基础问题整理</h2><h3 id="1-选择器权重潜规则"><a href="#1-选择器权重潜规则" class="headerlink" title="1. 选择器权重潜规则"></a>1. 选择器权重潜规则</h3><h4 id="谁的权重更大，谁才会生效。"><a href="#谁的权重更大，谁才会生效。" class="headerlink" title="谁的权重更大，谁才会生效。"></a>谁的权重更大，谁才会生效。</h4><p>！important带有这个属性的优先级是最高的。<br>    内联样式。直接写在元素属性上的样式的优先级更高。<br>    同等权重下，后写的优先级生效。<br>    具体排序：！important&gt;行内样式&gt;ID选择器&gt;类选择器&gt;元素选择器&gt;通配符选择器（用星号*表示）&gt;继承&gt;浏览器默认属性</p>
<h3 id="2-雪碧图-css精灵-的作用"><a href="#2-雪碧图-css精灵-的作用" class="headerlink" title="2. 雪碧图(css精灵)的作用"></a>2. 雪碧图(css精灵)的作用</h3><p>减少HTTP请求数，提高加载性能<br>有一些情况下可以减少图片大小。（只是作用不是特别明显）</p>
<h3 id="3-自定义字体的使用场景"><a href="#3-自定义字体的使用场景" class="headerlink" title="3.自定义字体的使用场景"></a>3.自定义字体的使用场景</h3>
      
      <a class="article-more-link" href="/2020/04/09/CSS%E5%9F%BA%E7%A1%80%E9%97%AE%E9%A2%98/">阅读更多...</a>
      
      
      <!-- reward -->
      
    </div>
    
    
      <!-- copyright -->
      
    <footer class="article-footer">
      
      

    </footer>

  </div>

  

  
  
  

  

</article>
    
    <article id="post-七大奇迹之长城" class="article article-type-post" itemscope
  itemprop="blogPost" data-scroll-reveal>

  <div class="article-inner">
    
    <header class="article-header">
       
<h2 itemprop="name">
  <a class="article-title" href="/2019/06/09/%E4%B8%83%E5%A4%A7%E5%A5%87%E8%BF%B9%E4%B9%8B%E9%95%BF%E5%9F%8E/"
    >七大奇迹之长城</a> 
</h2>
 

    </header>
    

    
    <div class="article-meta">
      <a href="/2019/06/09/%E4%B8%83%E5%A4%A7%E5%A5%87%E8%BF%B9%E4%B9%8B%E9%95%BF%E5%9F%8E/" class="article-date">
  <time datetime="2019-06-09T04:20:20.000Z" itemprop="datePublished">2019-06-09</time>
</a>
      
  <div class="article-category">
    <a class="article-category-link" href="/categories/%E6%97%85%E8%A1%8C/">旅行</a>
  </div>

      
      
      
    </div>
    

    

    
    <div class="article-entry" itemprop="articleBody">
      
      

      
      <p>八达岭长城</p>

      
      <!-- reward -->
      
    </div>
    
    
      <!-- copyright -->
      
    <footer class="article-footer">
      
      
  <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E6%97%85%E8%A1%8C/" rel="tag">旅行</a></li></ul>


    </footer>

  </div>

  

  
  
  

  

</article>
    
    <article id="post-nginx日常" class="article article-type-post" itemscope
  itemprop="blogPost" data-scroll-reveal>

  <div class="article-inner">
    
    <header class="article-header">
       
<h2 itemprop="name">
  <a class="article-title" href="/2019/05/18/nginx%E6%97%A5%E5%B8%B8/"
    >nginx日常</a> 
</h2>
 

    </header>
    

    
    <div class="article-meta">
      <a href="/2019/05/18/nginx%E6%97%A5%E5%B8%B8/" class="article-date">
  <time datetime="2019-05-18T04:19:28.000Z" itemprop="datePublished">2019-05-18</time>
</a>
      
  <div class="article-category">
    <a class="article-category-link" href="/categories/%E5%AD%A6%E4%B9%A0/">学习</a>
  </div>

      
      
      
    </div>
    

    

    
    <div class="article-entry" itemprop="articleBody">
      
      

      
      <h2 id="关于Nginx-403-forbidden-错误踩的坑-directory-index-of-“-xx-xx-xx-“-is-forbidden"><a href="#关于Nginx-403-forbidden-错误踩的坑-directory-index-of-“-xx-xx-xx-“-is-forbidden" class="headerlink" title="关于Nginx 403 forbidden 错误踩的坑 directory index of “/xx/xx/xx/“ is forbidden"></a>关于Nginx 403 forbidden 错误踩的坑 directory index of “/xx/xx/xx/“ is forbidden</h2><p>server {<br>        listen xxx;<br>        server_name xxx.test.com;</p>
<pre><code>    location / {

    root /Downloads/Dokcers/b1/downloads;
    autoindex on;       # &lt;----罪魁祸首，添加这个以后不再出现403错误
    #index  index.php index.html;  

    # auth 
    auth_basic &quot;Please input B1 password&quot;;     # 设置加密登陆的提示
    auth_basic_user_file /etc/nginx/xxx/.htpasswd;  # 设置加密的账号密码文件
   }

    # log
    access_log /Downloads/Dokcers/b1/web/access.log;
    error_log /Downloads/Dokcers/b1/web/error.log info;  # 打开这个模式有注意排错

    # IP access  
    allow 192.168.x.x/22;  # 限制IP段登陆
    deny all;
}</code></pre><h3 id="除了以上情况，还有403错误。需要排查的思路"><a href="#除了以上情况，还有403错误。需要排查的思路" class="headerlink" title="除了以上情况，还有403错误。需要排查的思路"></a>除了以上情况，还有403错误。需要排查的思路</h3><ol>
<li><p>selinux</p>
</li>
<li><p>目录下有没有index.html 文件（如果有就需要配套有 index index.html ）</p>
</li>
<li><p>权限问题</p>
</li>
</ol>
<p>喜欢的话给个star吧!<br> <iframe  
style="margin-left: 2px; margin-bottom:-5px;"  
frameborder="0" scrolling="0" width="100px" height="20px"  
src="https://ghbtns.com/github-btn.html?user=AIZSQ521&repo=AIZSQ521.github.io&type=star&count=true" >  </p>
</iframe>

      
      <!-- reward -->
      
    </div>
    
    
      <!-- copyright -->
      
    <footer class="article-footer">
      
      
  <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/nginx/" rel="tag">nginx</a></li></ul>


    </footer>

  </div>

  

  
  
  

  

</article>
    
    <article id="post-linux日常" class="article article-type-post" itemscope
  itemprop="blogPost" data-scroll-reveal>

  <div class="article-inner">
    
    <header class="article-header">
       
<h2 itemprop="name">
  <a class="article-title" href="/2019/04/02/linux%E6%97%A5%E5%B8%B8/"
    >linux日常</a> 
</h2>
 

    </header>
    

    
    <div class="article-meta">
      <a href="/2019/04/02/linux%E6%97%A5%E5%B8%B8/" class="article-date">
  <time datetime="2019-04-02T06:33:45.000Z" itemprop="datePublished">2019-04-02</time>
</a>
      
  <div class="article-category">
    <a class="article-category-link" href="/categories/%E5%AD%A6%E4%B9%A0/">学习</a>
  </div>

      
      
      
    </div>
    

    

    
    <div class="article-entry" itemprop="articleBody">
      
      

      
      <h3 id="Linux执行-wget命令-提示command-not-found的两种解决方法"><a href="#Linux执行-wget命令-提示command-not-found的两种解决方法" class="headerlink" title="# Linux执行 wget命令:提示command not found的两种解决方法"></a># Linux执行 wget命令:提示command not found的两种解决方法</h3><blockquote>
<p>1、rpm 安装<br>       下载wget的RPM包：<br><a href="http://mirrors.163.com/centos/6.8/os/x86_64/Packages/wget-1.12-8.el6.x86_64.rpm" target="_blank" rel="noopener">http://mirrors.163.com/centos/6.8/os/x86_64/Packages/wget-1.12-8.el6.x86_64.rpm</a><br>执行 rpm -ivh wget-1.12-8.el6.x86_64.rpm<br>2、yum安装<br>       yum -y install wget</p>
</blockquote>
<h3 id="CentOS-6-8-su-root-后，输入密码提示Incorrect-Password，如何解决？"><a href="#CentOS-6-8-su-root-后，输入密码提示Incorrect-Password，如何解决？" class="headerlink" title="# CentOS 6.8 su root 后，输入密码提示Incorrect Password，如何解决？"></a># CentOS 6.8 su root 后，输入密码提示Incorrect Password，如何解决？</h3><p>root密码是正确的<br>root密码是正确的</p>
<blockquote>
<p>解决:<br>在root账户下或者具有了root权限，可以查看/etc/pam.d/su<br>#auth required pam_wheel.so use_uid 这句是否被启用，如果启用了，那么加入了wheel组的用户（usermod -g wheel 用户id）才能su，否则就会提示密码错误。</p>
</blockquote>
<h3 id="CentOS-使用yum命令安装出现错误提示：Loaded-plugins-fastestmirror"><a href="#CentOS-使用yum命令安装出现错误提示：Loaded-plugins-fastestmirror" class="headerlink" title="# CentOS 使用yum命令安装出现错误提示：Loaded plugins: fastestmirror"></a># CentOS 使用yum命令安装出现错误提示：Loaded plugins: fastestmirror</h3><p> yum install的时候提示：Loaded plugins: fastestmirror</p>
<p>fastestmirror是yum的一个加速插件，这里是插件提示信息是插件不能用了。</p>
<p>不能用就先别用呗，禁用掉，先yum了再说。</p>
<blockquote>
<p>解决<br>1.修改插件的配置文件<br>vi /etc/yum/pluginconf.d/fastestmirror.conf<br>enabled = 1//由1改为0，禁用该插件<br>2.修改yum的配置文件<br>vi /etc/yum.conf<br>plugins=1//改为0，不使用插件</p>
</blockquote>
<p> 喜欢的话给个star吧!<br> <iframe  
style="margin-left: 2px; margin-bottom:-5px;"  
frameborder="0" scrolling="0" width="100px" height="20px"  
src="https://ghbtns.com/github-btn.html?user=AIZSQ521&repo=AIZSQ521.github.io&type=star&count=true" >  </p>
</iframe>

      
      <!-- reward -->
      
    </div>
    
    
      <!-- copyright -->
      
    <footer class="article-footer">
      
      
  <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/linux/" rel="tag">linux</a></li></ul>


    </footer>

  </div>

  

  
  
  

  

</article>
    
    <article id="post-手机摄影学习笔记" class="article article-type-post" itemscope
  itemprop="blogPost" data-scroll-reveal>

  <div class="article-inner">
    
    <header class="article-header">
       
<h2 itemprop="name">
  <a class="article-title" href="/2018/06/20/%E6%89%8B%E6%9C%BA%E6%91%84%E5%BD%B1%E5%AD%A6%E4%B9%A0%E7%AC%94%E8%AE%B0/"
    >手机摄影学习笔记</a> 
</h2>
 

    </header>
    

    
    <div class="article-meta">
      <a href="/2018/06/20/%E6%89%8B%E6%9C%BA%E6%91%84%E5%BD%B1%E5%AD%A6%E4%B9%A0%E7%AC%94%E8%AE%B0/" class="article-date">
  <time datetime="2018-06-20T02:49:56.000Z" itemprop="datePublished">2018-06-20</time>
</a>
      
  <div class="article-category">
    <a class="article-category-link" href="/categories/%E5%AD%A6%E4%B9%A0/">学习</a>
  </div>

      
      
      
    </div>
    

    

    
    <div class="article-entry" itemprop="articleBody">
      
      

      
      <h2 id="取景"><a href="#取景" class="headerlink" title="取景"></a>取景</h2><p>在混乱中建立一种美的秩序</p>
<h3 id="一-取景方法"><a href="#一-取景方法" class="headerlink" title="一. 取景方法"></a>一. 取景方法</h3><h4 id="数字取景法"><a href="#数字取景法" class="headerlink" title="数字取景法"></a>数字取景法</h4><h5 id="1-三分法"><a href="#1-三分法" class="headerlink" title="1.三分法"></a>1.<strong>三分法</strong></h5><p>横三分;</p>
<p><img src="https://i.loli.net/2020/04/08/UH23y5BaOrpRtdl.png" alt=""></p>
      
      <a class="article-more-link" href="/2018/06/20/%E6%89%8B%E6%9C%BA%E6%91%84%E5%BD%B1%E5%AD%A6%E4%B9%A0%E7%AC%94%E8%AE%B0/">阅读更多...</a>
      
      
      <!-- reward -->
      
    </div>
    
    
      <!-- copyright -->
      
    <footer class="article-footer">
      
      
  <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E6%91%84%E5%BD%B1/" rel="tag">摄影</a></li></ul>


    </footer>

  </div>

  

  
  
  

  

</article>
    
    <article id="post-改革开放深圳" class="article article-type-post" itemscope
  itemprop="blogPost" data-scroll-reveal>

  <div class="article-inner">
    
    <header class="article-header">
       
<h2 itemprop="name">
  <a class="article-title" href="/2018/04/28/%E6%94%B9%E9%9D%A9%E5%BC%80%E6%94%BE%E6%B7%B1%E5%9C%B3/"
    >改革开放深圳</a> 
</h2>
 

    </header>
    

    
    <div class="article-meta">
      <a href="/2018/04/28/%E6%94%B9%E9%9D%A9%E5%BC%80%E6%94%BE%E6%B7%B1%E5%9C%B3/" class="article-date">
  <time datetime="2018-04-27T16:00:00.000Z" itemprop="datePublished">2018-04-28</time>
</a>
      
  <div class="article-category">
    <a class="article-category-link" href="/categories/%E6%97%85%E8%A1%8C/">旅行</a>
  </div>

      
      
      
    </div>
    

    

    
    <div class="article-entry" itemprop="articleBody">
      
      

      
      
      
      <!-- reward -->
      
    </div>
    
    
      <!-- copyright -->
      
    <footer class="article-footer">
      
      
  <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E6%97%85%E8%A1%8C-%E4%BC%9A%E5%8F%8B/" rel="tag">旅行 会友</a></li></ul>


    </footer>

  </div>

  

  
  
  

  

</article>
    
    <article id="post-hello" class="article article-type-post" itemscope
  itemprop="blogPost" data-scroll-reveal>

  <div class="article-inner">
    
    <header class="article-header">
       
<h2 itemprop="name">
  <a class="article-title" href="/2017/09/11/hello/"
    >Hello!新来的你!</a> 
</h2>
 

    </header>
    

    
    <div class="article-meta">
      <a href="/2017/09/11/hello/" class="article-date">
  <time datetime="2017-09-11T11:22:49.000Z" itemprop="datePublished">2017-09-11</time>
</a>
      
  <div class="article-category">
    <a class="article-category-link" href="/categories/%E4%BF%AE%E8%BA%AB/">修身</a>
  </div>

      
      
      
    </div>
    

    

    
    <div class="article-entry" itemprop="articleBody">
      
      

      
      <p>欢迎来到付硕的<a href="https://fushuo.xyz/" target="_blank" rel="noopener">老窝</a>! 感谢您的来访,您的到来让我的家蓬荜生辉 !<br>我与春风皆过客，你携秋水揽星河。</p>
<h3 id="先来点干货"><a href="#先来点干货" class="headerlink" title="先来点干货"></a><em>先来点干货</em></h3><blockquote>
<p>人生漫漫有时伤感。<br>不要在意那些细枝末节，它们都会在时间的长河里消失殆尽。<br>好好活着，丰富多彩地活着，你正活生生地活着。（今夕何夕）</p>
</blockquote>
<blockquote>
<p>以后的路还很长，以后很长的路也会戛然而止。<br>所以，我视你为珍爱，让你的笑和泪流在我脸上。<br>在每一次入睡前，捏你的手，说：晚安晚安，梦中见。（海桑）</p>
</blockquote>
<blockquote>
<p>我们还年轻，年轻就可以失败。(谁的青春不迷茫 刘同)</p>
</blockquote>
      
      <a class="article-more-link" href="/2017/09/11/hello/">阅读更多...</a>
      
      
      <!-- reward -->
      
    </div>
    
    
      <!-- copyright -->
      
    <footer class="article-footer">
      
      
  <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E6%AF%92%E9%B8%A1%E6%B1%A4/" rel="tag">毒鸡汤</a></li></ul>


    </footer>

  </div>

  

  
  
  

  

</article>
    
    <article id="post-海上第一山崂山" class="article article-type-post" itemscope
  itemprop="blogPost" data-scroll-reveal>

  <div class="article-inner">
    
    <header class="article-header">
       
<h2 itemprop="name">
  <a class="article-title" href="/2016/06/10/%E6%B5%B7%E4%B8%8A%E7%AC%AC%E4%B8%80%E5%B1%B1%E5%B4%82%E5%B1%B1/"
    >海上第一山崂山</a> 
</h2>
 

    </header>
    

    
    <div class="article-meta">
      <a href="/2016/06/10/%E6%B5%B7%E4%B8%8A%E7%AC%AC%E4%B8%80%E5%B1%B1%E5%B4%82%E5%B1%B1/" class="article-date">
  <time datetime="2016-06-10T13:19:20.000Z" itemprop="datePublished">2016-06-10</time>
</a>
      
  <div class="article-category">
    <a class="article-category-link" href="/categories/%E6%97%85%E8%A1%8C/">旅行</a>
  </div>

      
      
      
    </div>
    

    

    
    <div class="article-entry" itemprop="articleBody">
      
      

      
      <p>14-04-30北九水初探，加再探太清仰口</p>

      
      <!-- reward -->
      
    </div>
    
    
      <!-- copyright -->
      
    <footer class="article-footer">
      
      
  <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E6%97%85%E8%A1%8C/" rel="tag">旅行</a></li></ul>


    </footer>

  </div>

  

  
  
  

  

</article>
    
    <article id="post-洞庭西湖+明珠上海" class="article article-type-post" itemscope
  itemprop="blogPost" data-scroll-reveal>

  <div class="article-inner">
    
    <header class="article-header">
       
<h2 itemprop="name">
  <a class="article-title" href="/2015/03/19/%E6%B4%9E%E5%BA%AD%E8%A5%BF%E6%B9%96+%E6%98%8E%E7%8F%A0%E4%B8%8A%E6%B5%B7/"
    >洞庭西湖明珠上海</a> 
</h2>
 

    </header>
    

    
    <div class="article-meta">
      <a href="/2015/03/19/%E6%B4%9E%E5%BA%AD%E8%A5%BF%E6%B9%96+%E6%98%8E%E7%8F%A0%E4%B8%8A%E6%B5%B7/" class="article-date">
  <time datetime="2015-03-19T11:29:14.000Z" itemprop="datePublished">2015-03-19</time>
</a>
      
  <div class="article-category">
    <a class="article-category-link" href="/categories/%E6%97%85%E8%A1%8C/">旅行</a>
  </div>

      
      
      
    </div>
    

    

    
    <div class="article-entry" itemprop="articleBody">
      
      

      
      <p>“上有天堂，下有苏杭”，还有压住白娘子的雷峰塔，从小便时常向往西湖的风景。</p>

      
      <!-- reward -->
      
    </div>
    
    
      <!-- copyright -->
      
    <footer class="article-footer">
      
      
  <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E6%97%85%E8%A1%8C/" rel="tag">旅行</a></li></ul>


    </footer>

  </div>

  

  
  
  

  

</article>
    
    <article id="post-五岳之首泰山" class="article article-type-post" itemscope
  itemprop="blogPost" data-scroll-reveal>

  <div class="article-inner">
    
    <header class="article-header">
       
<h2 itemprop="name">
  <a class="article-title" href="/2013/05/01/%E4%BA%94%E5%B2%B3%E4%B9%8B%E9%A6%96%E6%B3%B0%E5%B1%B1/"
    >五一五岳之首泰山</a> 
</h2>
 

    </header>
    

    
    <div class="article-meta">
      <a href="/2013/05/01/%E4%BA%94%E5%B2%B3%E4%B9%8B%E9%A6%96%E6%B3%B0%E5%B1%B1/" class="article-date">
  <time datetime="2013-05-01T11:15:25.000Z" itemprop="datePublished">2013-05-01</time>
</a>
      
  <div class="article-category">
    <a class="article-category-link" href="/categories/%E6%97%85%E8%A1%8C/">旅行</a>
  </div>

      
      
      
    </div>
    

    

    
    <div class="article-entry" itemprop="articleBody">
      
      

      
      <p>4个小时的登高 回来轻了7斤。</p>

      
      <!-- reward -->
      
    </div>
    
    
      <!-- copyright -->
      
    <footer class="article-footer">
      
      
  <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E6%97%85%E8%A1%8C/" rel="tag">旅行</a></li></ul>


    </footer>

  </div>

  

  
  
  

  

</article>
    
  </article>
  

  
</section>
</div>

      <footer class="footer">
  <div class="outer">
    <ul class="list-inline">
      <li>
        &copy;
        2016-2020
        FuShuo
      </li>
      <li>
        
      </li>
    </ul>
    <ul class="list-inline">
      <li>
        
        
        <span>
  <i>PV:<span id="busuanzi_value_page_pv"></span></i>
  <i>UV:<span id="busuanzi_value_site_uv"></span></i>
</span>
        
      </li>
      
      <li>
        <!-- cnzz统计 -->
        
        <script type="text/javascript" src='https://s9.cnzz.com/z_stat.php?id=1278069914&amp;web_id=1278069914'></script>
        
      </li>
    </ul>
  </div>
</footer>
      <div class="float_btns">
        <div class="totop" id="totop">
  <i class="ri-arrow-up-line"></i>
</div>

<div class="todark" id="todark">
  <i class="ri-moon-line"></i>
</div>

      </div>
    </main>
    <aside class="sidebar on">
      <button class="navbar-toggle"></button>
<nav class="navbar">
  
  <div class="logo">
    <a href="/"><img src="/images/ayer-side.svg" alt="心"></a>
  </div>
  
  <ul class="nav nav-main">
    
    <li class="nav-item">
      <a class="nav-item-link" href="/">主页</a>
    </li>
    
    <li class="nav-item">
      <a class="nav-item-link" href="/archives">归档</a>
    </li>
    
    <li class="nav-item">
      <a class="nav-item-link" href="/categories">分类</a>
    </li>
    
    <li class="nav-item">
      <a class="nav-item-link" href="/tags">标签</a>
    </li>
    
    <li class="nav-item">
      <a class="nav-item-link" href="/tags/%E6%97%85%E8%A1%8C/">旅行</a>
    </li>
    
    <li class="nav-item">
      <a class="nav-item-link" href="https://fushuo-top.lofter.com" target="_blank" rel="noopener">摄影</a>
    </li>
    
    <li class="nav-item">
      <a class="nav-item-link" href="/2019/about">关于我</a>
    </li>
    
  </ul>
</nav>
<nav class="navbar navbar-bottom">
  <ul class="nav">
    <li class="nav-item">
      
      <a class="nav-item-link nav-item-search"  title="搜索">
        <i class="ri-search-line"></i>
      </a>
      
      
      <a class="nav-item-link" target="_blank" href="/atom.xml" title="RSS Feed">
        <i class="ri-rss-line"></i>
      </a>
      
    </li>
  </ul>
</nav>
<div class="search-form-wrap">
  <div class="local-search local-search-plugin">
  <input type="search" id="local-search-input" class="local-search-input" placeholder="Search...">
  <div id="local-search-result" class="local-search-result"></div>
</div>
</div>
    </aside>
    <script>
      if (window.matchMedia("(max-width: 768px)").matches) {
        document.querySelector('.content').classList.remove('on');
        document.querySelector('.sidebar').classList.remove('on');
      }
    </script>
    <div id="mask"></div>

<!-- #reward -->
<div id="reward">
  <span class="close"><i class="ri-close-line"></i></span>
  <p class="reward-p"><i class="ri-cup-line"></i>请我喝杯咖啡吧~</p>
  <div class="reward-box">
    
    <div class="reward-item">
      <img class="reward-img" src="/images/alipay.jpg">
      <span class="reward-type">支付宝</span>
    </div>
    
    
    <div class="reward-item">
      <img class="reward-img" src="/images/wechat.jpg">
      <span class="reward-type">微信</span>
    </div>
    
  </div>
</div>
    
<script src="/js/jquery-2.0.3.min.js"></script>


<script src="/js/lazyload.min.js"></script>


<script>
  try {
    var typed = new Typed("#subtitle", {
      strings: ['时光静好,细水流年', '愿山野浓雾有路灯，风雨漂泊有归舟', '微笑向暖安之若素，你若盛开清风自来'],
      startDelay: 0,
      typeSpeed: 200,
      loop: true,
      backSpeed: 100,
      showCursor: true
    });
  } catch (err) {
  }

</script>





<script src="https://cdn.jsdelivr.net/npm/jquery-modal@0.9.2/jquery.modal.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jquery-modal@0.9.2/jquery.modal.min.css">
<script src="https://cdn.jsdelivr.net/npm/justifiedGallery@3.7.0/dist/js/jquery.justifiedGallery.min.js"></script>

<script src="/dist/main.js"></script>



<!-- Root element of PhotoSwipe. Must have class pswp. -->
<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">

    <!-- Background of PhotoSwipe. 
         It's a separate element as animating opacity is faster than rgba(). -->
    <div class="pswp__bg"></div>

    <!-- Slides wrapper with overflow:hidden. -->
    <div class="pswp__scroll-wrap">

        <!-- Container that holds slides. 
            PhotoSwipe keeps only 3 of them in the DOM to save memory.
            Don't modify these 3 pswp__item elements, data is added later on. -->
        <div class="pswp__container">
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
        </div>

        <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
        <div class="pswp__ui pswp__ui--hidden">

            <div class="pswp__top-bar">

                <!--  Controls are self-explanatory. Order can be changed. -->

                <div class="pswp__counter"></div>

                <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>

                <button class="pswp__button pswp__button--share" style="display:none" title="Share"></button>

                <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>

                <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>

                <!-- Preloader demo http://codepen.io/dimsemenov/pen/yyBWoR -->
                <!-- element will get class pswp__preloader--active when preloader is running -->
                <div class="pswp__preloader">
                    <div class="pswp__preloader__icn">
                        <div class="pswp__preloader__cut">
                            <div class="pswp__preloader__donut"></div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                <div class="pswp__share-tooltip"></div>
            </div>

            <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
            </button>

            <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
            </button>

            <div class="pswp__caption">
                <div class="pswp__caption__center"></div>
            </div>

        </div>

    </div>

</div>

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/photoswipe@4.1.3/dist/photoswipe.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/photoswipe@4.1.3/dist/default-skin/default-skin.min.css">
<script src="https://cdn.jsdelivr.net/npm/photoswipe@4.1.3/dist/photoswipe.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/photoswipe@4.1.3/dist/photoswipe-ui-default.min.js"></script>

<script>
    function viewer_init() {
        let pswpElement = document.querySelectorAll('.pswp')[0];
        let $imgArr = document.querySelectorAll(('.article-entry img:not(.reward-img)'))

        $imgArr.forEach(($em, i) => {
            $em.onclick = () => {
                // slider展开状态
                // todo: 这样不好，后面改成状态
                if (document.querySelector('.left-col.show')) return
                let items = []
                $imgArr.forEach(($em2, i2) => {
                    let img = $em2.getAttribute('data-idx', i2)
                    let src = $em2.getAttribute('data-target') || $em2.getAttribute('src')
                    let title = $em2.getAttribute('alt')
                    // 获得原图尺寸
                    const image = new Image()
                    image.src = src
                    items.push({
                        src: src,
                        w: image.width || $em2.width,
                        h: image.height || $em2.height,
                        title: title
                    })
                })
                var gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, {
                    index: parseInt(i)
                });
                gallery.init()
            }
        })
    }
    viewer_init()
</script>





<script src="/js/busuanzi-2.3.pure.min.js"></script>



<script type="text/javascript" src="https://js.users.51.la/20544303.js"></script>


    
    <div id="music">
    
        
            
                <iframe frameborder="no" border="1" marginwidth="0" marginheight="0" width="200" height="52" src="//music.163.com/outchain/player?type=2&id=1294148065&auto=1&height=32"></iframe>
                <!-- <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=298 height=52 src="//music.163.com/outchain/player?type=2&id=586299&auto=1&height=32"></iframe> -->
                <!-- <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=298 height=52 src="//music.163.com/outchain/player?type=2&id=1294148065&auto=1&height=32"></iframe> //城南花已开-->
</div>

<style>
    #music {
        position: fixed;
        right: 15px;
        bottom: 0;
        z-index: 998;
    }
</style>
    
  </div>
</body>

</html>